import { Link, Outlet } from 'umi';
import styles from './index.less';
import { Counter } from '@/components/Counter';
import { remoteCallFunction } from '@/components/IframeMicro';

export default function Layout() {
  return (
    <div className={styles.navs}>
      <span>这里是父亲模块</span>
      <button onClick={async () => {
        try{
          const result: any = await remoteCallFunction({
            microApp: 'app1',
            functionName: 'test22222sum',
            args: [3,5]
          });
          alert(`调用成功, 返回结果为： ${result}`)
        }catch(e: any) {
          alert(`调用失败，失败原因： ${e.message}`)
        }
        
      }}>调用模块2的函数计算某个值</button>
      <Counter />
      <ul>
        <li>
          <Link to="/">Home</Link>
        </li>
        <li>
          <Link to="/docs">Docs</Link>
        </li>
        <li>
          <Link to="/app1/page1">test-iframe-page1</Link>
        </li>
        <li>
          <Link to="/app1/page2">test-iframe-page2</Link>
        </li>
        <li>
          <Link to="/app2/page3">test-iframe-page1</Link>
        </li>
        <li>
          <Link to="/app2/page4">test-iframe-page2</Link>
        </li>
      </ul>
      <div className={styles['page-container']}>
        <Outlet />
      </div>
    </div>
  );
}
